<template>
		<el-date-picker
      v-if="timeType == 1"
			v-model="timeValueSy"
			type="monthrange"
			range-separator="至"
			start-placeholder="开始日期"
			end-placeholder="结束日期"
			@change="optTimeSy"
			format="YYYY-MM"
			value-format="YYYY-MM"
			unlink-panels
			:shortcuts="shortcuts"
		>
		</el-date-picker>
    <el-date-picker
    v-if="timeType == 2"
			v-model="timeValueSy"
      type="month"
			range-separator="至"
			start-placeholder="开始日期"
			end-placeholder="结束日期"
			@change="optTimeSy"
			format="YYYY-MM"
			value-format="YYYY-MM"
			unlink-panels
		>
		</el-date-picker>
    <el-date-picker
    v-if="timeType == 3"
			v-model="timeValueSy"
      type="year"
			@change="optTimeSy"
			format="YYYY"
			value-format="YYYY"
			unlink-panels
		>
		</el-date-picker>
    <!-- <el-date-picker
    v-if="timeType == 4"
			v-model="timeValueSy"
			@change="optTimeSy"
      type="daterange"
      format="YYYY"
			value-format="YYYY"
      unlink-panels
		>
		</el-date-picker> -->
</template>

<script setup lang="ts">
import { ref,defineProps,onMounted,defineEmits} from 'vue';

let timeValueSy = ref(null)
const emit = defineEmits(['timeValueChange'])
const shortcuts = [
  {
    text: '本月',
    value: [new Date(), new Date()],
  },
  {
    text: '今年至今',
    value: () => {
      const end = new Date()
      const start = new Date(new Date().getFullYear(), 0)
      return [start, end]
    },
  },
  {
    text: '最近6个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setMonth(start.getMonth() - 6)
      return [start, end]
    },
  },
]
const pickerOptions = {
      shortcuts: [{
        text: '今年',
        onClick(picker) {
          const end = new Date();
          const start = new Date(end.getFullYear(), 0, 1);
          picker.$emit('pick', [start, end]);
        }
      }, {
        text: '去年',
        onClick(picker) {
          const end = new Date();
          const start = new Date(end.getFullYear() - 1, 0, 1);
          picker.$emit('pick', [start, end]);
        }
      }]
    }
// 接收参数
const props = defineProps({
  type: {
    type: Object,
    default: () => {},
  },
  timeType: {
    type: Number,
    default: () => {},
  },
});
const timeType = props.timeType

const optTimeSy = (value) => {
  console.log(value)
  if(value){
    let dataValue = {
		type:props.type,
		times:value
	  }
	  emit('timeValueChange', dataValue)
  }
} 
onMounted (() => {
})


</script>
<style scoped lang="less">
.el-picker-panel__footer{
  background: #1C5BCC !important;
}
</style>